<template>
   <el-row class="main">
       <el-col v-if=" type === 1 ">
        <img class="logo" src="@/assets/img/logo.png" alt />
        <span class="label2"> {{label}}<span class="num1">{{num}}</span>{{unit}}</span> 
       </el-col>
       <el-col v-if="type === 2">
           <div><span class="num2">{{num}}</span>{{unit}}</div>
            <div><span class="label2"> {{label}}</span></div>
       </el-col>
   </el-row>
</template>
<script>
export default {
    data(){
        return{
        }
    },
    props:['label','num','unit','type']
}
</script>
<style lang="scss" scoped>
        .logo{
            width: 30px;
            height: 30px;
            border-radius: 50%;
            padding:0 20px;

        }
        .el-col img{
             vertical-align: middle;
        }
        .label1{
            display: inline-block;
            line-height: 30px;
            font-size: 14px;
        }
        .num1{
            display: inline-block;
            padding: 0 5px;
            font-size: 18px;
            font-weight: bold;
            color:#409EFF
        }
        .num2{
            color: #74A0FA;
            font-size: 24px;
            font-weight: 500;
        }
        .label2{
            font-size: 14px;
        }
        
       
    
</style>